<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@taglib uri="http://www.springframework.org/security/tags" prefix="security" %>
<!-- 分配角色保存的按钮 -->
<c:set var="ASSIGN_ROLE_SAVE_BUTTON" value="${CODE_AUTH.user_assign_role_button}"></c:set>
<!-- 是否有分配角色保存的权限 -->						
<security:authorize var="HAS_AUTH_ASSIGN_ROLE_SAVE" access="${ASSIGN_ROLE_SAVE_BUTTON.SPEL}"></security:authorize>	
<!DOCTYPE html>
<html lang="zh-CN">
<!-- 引入头部 -->
<%@include file="/WEB-INF/include-head.jsp"%>
<script type="text/javascript">
$(function(){
	
	// 给向右按钮绑定单击响应函数
	$("#toRightBtn").click(function(){
		
		// 获取未分配的select元素已选中的option
		var options = $("select:eq(0)").find("option:selected");
		
		// 判断是否有选中的元素
		if(options.length == 0){
			layer.msg("请先在左边的列表中选择要分配的角色！");
			return null;
		}
		
		// 把选中的元素追加到已分配的select中
		options.appendTo("select:eq(1)");
	});
	
	// 给向左按钮绑定单击响应函数
	$("#toLeftBtn").click(function(){
		
		// 获取已分配的select元素已选中的option
		var options = $("select:eq(1)").find("option:selected");
		
		// 判断是否有选中的元素
		if(options.length == 0){
			layer.msg("请先在右边的列表中选择要取消分配的角色！");
			return null;
		}
		
		// 把选中的元素追加到未分配的select中
		options.appendTo("select:eq(0)");
	});
	
	// 给提交按钮绑定单击响应函数
	$("#submitBtn").click(function(){
		
		// 选中右侧已分配select列表中的全部元素再提交
		$("select:eq(1) option").prop("selected", true);
	});
	
});
</script>
<body>
	<!-- 引入导航条 -->
	<%@include file="/WEB-INF/include-nav.jsp"%>
	<div class="container-fluid">
		<div class="row">
			<!-- 引入侧边栏 -->
			<%@include file="/WEB-INF/include-sidebar.jsp"%>
			<div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
				<ol class="breadcrumb">
					<li><a href="admin/to/main/page.html">首页</a></li>
					<li><a href="admin/get/page.html">数据列表</a></li>
					<li class="active">分配角色</li>
				</ol>
				<div class="panel panel-default">
					<div class="panel-body">
						<form action="${ASSIGN_ROLE_SAVE_BUTTON.URL}" method="post" role="form" class="form-inline">
							<!-- csrf隐藏域 -->
							<input type="hidden" name="${_csrf.parameterName }" value="${_csrf.token }"/>
			
							<!-- 隐藏域 -->
							<input type="hidden" name="adminId" value="${param.adminId}"/>
							<input type="hidden" name="pageNum" value="${param.pageNum}"/>
							<input type="hidden" name="keyword" value="${param.keyword}"/>
							<div class="form-group">
								<label for="exampleInputPassword1">未分配角色列表</label><br> 
								<select
									class="form-control" multiple size="10"
									style="width: 200px; overflow-y: auto;">
									<c:forEach items="${unassignedRoleList}" var="role">
										<option value="${role.id}">${role.name}</option>
									</c:forEach>
								</select>
							</div>
							<div class="form-group">
								<ul>
									<li id="toRightBtn" class="btn btn-default glyphicon glyphicon-chevron-right"></li>
									<br>
									<li id="toLeftBtn" class="btn btn-default glyphicon glyphicon-chevron-left"
										style="margin-top: 20px;"></li>
								</ul>
							</div>
							<div class="form-group" style="margin-left: 40px;">
								<label for="exampleInputPassword1">已分配角色列表</label><br> 
								<select
									name="roleIdList"
									class="form-control" multiple size="10"
									style="width: 200px; overflow-y: auto;">
									<c:forEach items="${assignedRoleList}" var="role">
										<option value="${role.id}">${role.name}</option>
									</c:forEach>
								</select>
							</div>
							<div style="margin-top:20px;">
								<security:authorize access="${HAS_AUTH_ASSIGN_ROLE_SAVE}">
									<button id="submitBtn" type="submit" class="${ASSIGN_ROLE_SAVE_BUTTON.BUTTON_CLASS}">保存</button>
								</security:authorize>
							</div>
						</form>
					</div>
				</div>
			</div>
		</div>
	</div>
</body>
</html>